$(function () {
    // var whdef = 100/1920;// 表示1920的设计图,使用100PX的默认值
    var whdef = 100/916;// 表示1920的设计图,使用100PX的默认值
    var wH = window.innerHeight;// 当前窗口的高度
    var wW = window.innerWidth;// 当前窗口的宽度
    // var rem = wW * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
    var rem = wH * whdef;// 以默认比例值乘以当前窗口宽度,得到该宽度下的相应FONT-SIZE值
    $('html').css('font-size', rem + "px");

    // 加载党员年龄情况图的参数
    load_ec1(0);
    load_ec2(0);
    load_ec3(0);
    load_ec4(0);
    load_ec5(0);
    load_ec6(0);
    load_ec7(0);

}) ;

// 信息阅读量趋势
function load_ec1(type){
    myChart1.clear();
    option = {
        grid:{
            x:30,
            y:30,
            x2:10,
            height:'70%'
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            },
            data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
        },
        yAxis: {
            type: 'value',
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        series: [{
            data: [320, 532, 501, 434, 590, 530, 420],
            type: 'line',
            areaStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(
                        0, 0, 0, 1,
                        [
                            {offset: 0, color: '#646400'},
                            {offset: 0.5, color: '#c0c000'},
                            {offset: 1, color: '#ddd'}
                        ]
                    )
                }
            },
            itemStyle : {  
                normal : {  
                    lineStyle:{  
                        color:'#f00',
                        width: 5
                    }  
                }  
            }
        }]
    };
    myChart1.setOption(option);
}

// 书籍阅读时长趋势
function load_ec2(type){
    myChart2.clear();
    option = {
        grid:{
            x:30,
            y:30,
            x2:10,
            height:'70%'
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            },
            data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
        },
        yAxis: {
            type: 'value',
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        series: [{
            data: [820, 932, 901, 934, 1290, 1330, 1320],
            type: 'line',
            areaStyle: {
                normal: {
                    color: new echarts.graphic.LinearGradient(
                        0, 0, 0, 1,
                        [
                            {offset: 0, color: '#500a50'},
                            {offset: 0.5, color: '#c018c0'},
                            {offset: 1, color: '#ddd'}
                        ]
                    )
                }

            },
            itemStyle : {  
                normal : {  
                    lineStyle:{  
                        color:'#00f',
                        width: 5
                    }  
                }  
            }
        }]
    };
    myChart2.setOption(option);
}

// 最高人气书籍
function load_ec3(type){
    myChart3.clear();
    option = {
        grid:{
            x:30,
            y:30,
            x2:10,
            height:'70%'
        },
        xAxis: {
            type: 'category',
            axisLabel:{
                interval:0,
                textStyle:{
                    color: '#6cbbe6'
                }
            },
            data: ['书籍1', '书籍2', '书籍3', '书籍4', '书籍5', '书籍6', '书籍7', '书籍8', '书籍9', '书籍10', '书籍11', '书籍12']
        },
        yAxis: {
            type: 'value',
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        series: [{
            data: [41, 38, 30, 43, 46, 49, 54, 43, 41, 55, 58, 43],
            type: 'bar',
            barWidth: 20,
            itemStyle: {
                normal: {
                  color: new echarts.graphic.LinearGradient(
                    0, 0, 0, 1,
                  [
                      {offset: 0, color: '#ff4000'},   
                      {offset: 1, color: '#2FDECA'}
                  ]
               )
          },
          emphasis: {
            color: new echarts.graphic.LinearGradient(
                  0, 0, 0, 1,
                 [
                  {offset: 0, color: '#2FDECA'},
                  {offset: 1, color: '#ff4000'}
                 ]
            )
           }
       }
        }]
    };
    myChart3.setOption(option);
}

// 最受关注信息栏目
function load_ec4(type){
    myChart4.clear();
    option = {
        grid:{
            x:30,
            y:30,
            x2:10,
            height:'70%'
        },
        xAxis: {
            type: 'category',
            axisLabel:{
                interval:0,
                textStyle:{
                    color: '#6cbbe6'
                }
            },
            data: ['栏目1', '栏目2', '栏目3', '栏目4', '栏目5', '栏目6', '栏目7', '栏目8', '栏目9', '栏目10', '栏目11', '栏目12']
        },
        yAxis: {
            type: 'value',
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        series: [{
            data: [41, 38, 30, 43, 46, 49, 54, 43, 41, 55, 58, 43],
            type: 'bar',
            barWidth: 20,
            itemStyle: {
                normal: {
                  color: new echarts.graphic.LinearGradient(
                    0, 0, 0, 1,
                  [
                      {offset: 0, color: '#FF8000'},   
                      {offset: 1, color: '#2FDECA'}
                  ]
               )
          },
          emphasis: {
            color: new echarts.graphic.LinearGradient(
                  0, 0, 0, 1,
                 [
                  {offset: 0, color: '#2FDECA'},
                  {offset: 1, color: '#FF8000'}
                 ]
            )
           }
       }
        }]
    };
    myChart4.setOption(option);
}

// 最热信息
function load_ec5(type){
    myChart5.clear();
    var option = {
        dataset: {
            source: [
                ['score', 'amount', 'product'],
                [89.3, 260, '共产党宣言（全文）'],
                [57.1, 238, '理直气壮办好思政课'],
                [74.4, 220, '加强党的领导的三个重要维度'],
                [89.7, 198, '飘扬在高原律所的那一抹党旗红 '],
                [68.1, 167, '校准政治生态的风向标 '],
                [19.6, 230, '把党的政治建设摆在首位']
            ]
        },
        grid:{
            containLabel: true,
            x:30,
            y:20,
            x2:10,
            height:'85%'
        },
        xAxis: {
            name: 'amount',
            axisLabel:{
                interval:0,
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        yAxis: {
            type: 'category',
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        visualMap: {
            //orient: 'horizontal',
            top: 2,
            left: 0,
            min: 10,
            max: 100,
            text: ['高', '低'],
            // Map the score column to color
            dimension: 0,
            inRange: {
                color: ['#D7DA8B', '#E15457']
            },
            textStyle:{
                color: '#6cbbe6'
            }
        },
        
        series: [
            {
                type: 'bar',
                //barWidth:15,
                encode: {
                    // Map the "amount" column to X axis.
                    x: 'amount',
                    // Map the "product" column to Y axis
                    y: 'product'
                }
            }
        ]
    };
    myChart5.setOption(option);
}

// 活跃度排名
function load_ec6(type){
    myChart6.clear();
    option = {
        legend: {
            type:'plain',
            data:['发布','回复','浏览','合计'],
            orient: 'horizontal',
            top: 5,
            left: 'center',
            textStyle:{
                fontSize: 14,
                color: '#6cbbe6'
            }
        },
        tooltip: {},
        backgroundColor: 'rgba(255,255,255,0)',
        grid:{
            x:30,
            y:30,
            x2:10,
            height:'70%'
        },
        xAxis:[
            {
                type : 'category',
                data:['张三丰','赵敏','周芷若','张无忌','小昭'],
                boundaryGap : true,
                axisLabel:{
                    textStyle:{
                        color: '#6cbbe6'
                    }
                }
            }
        ],
        yAxis: [
            {
                type : 'value',
                axisLabel:{
                    textStyle:{
                        color: '#6cbbe6'
                    }
                }
            }
        ],
        series: [
            {
                name:['发布'],
                type: 'bar',
                barWidth:15, /* 柱子宽带 */
  	            barGap:'5%',/*多个并排柱子设置柱子之间的间距*/
  	            barCategoryGap:'5%',/*多个并排柱子设置柱子之间的间距*/

                data:[43,30,55,75,46]
            },
            {
                name:['回复'],
                type: 'bar',
                barWidth:15, /* 柱子宽带 */
  	            barGap:'5%',/*多个并排柱子设置柱子之间的间距*/
  	            barCategoryGap:'5%',/*多个并排柱子设置柱子之间的间距*/

                data:[43,30,55,75,46]
            },
            {
                name:['浏览'],
                type: 'bar',
                barWidth:15, /* 柱子宽带 */
  	            barGap:'5%',/*多个并排柱子设置柱子之间的间距*/
  	            barCategoryGap:'5%',/*多个并排柱子设置柱子之间的间距*/

                data:[43,30,55,75,46]
            },
            {
                name:['合计'],
                type: 'bar',
                barWidth:15,
  	            barGap:'5%',/*多个并排柱子设置柱子之间的间距*/
  	            barCategoryGap:'5%',/*多个并排柱子设置柱子之间的间距*/
                data:[85,70,45,25,54]
            }
        ]
    };
    myChart6.setOption(option);
}

// 书籍阅读时长排名
function load_ec7(type){
    myChart7.clear();

    var option = {
        dataset: {
            source: [
                ['amount', 'product'],
                [260, '张三丰'],
                [238, '张无忌'],
                [220, '赵敏'],
                [198, '周芷若'],
                [167, '小昭'],
                [230, '殷离']
            ]
        },
        grid:{
            containLabel: true,
            x:30,
            y:20,
            x2:10,
            height:'85%'
        },
        xAxis: {
            name: 'amount',
            axisLabel:{
                interval:0,
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        yAxis: {
            type: 'category',
            axisLabel:{
                textStyle:{
                    color: '#6cbbe6'
                }
            }
        },
        
        series: [
            {
                type: 'bar',
                //barWidth:15,
                itemStyle: { 
                    normal:{ 
                    color: function (params){
                        var colorList = ['rgb(205,85,85)','rgb(210,105,30)','rgb(0,139,0)','rgb(178,58,238)','rgb(54,100,139)','rgb(154,120,139)'];
                        return colorList[params.dataIndex];
                    }
                    },
                },
                    
                encode: {
                    // Map the "amount" column to X axis.
                    x: 'amount',
                    // Map the "product" column to Y axis
                    y: 'product'
                }
            }
        ]
    };
    myChart7.setOption(option);
}
